<#assign module="order"/>

<@override name="header">
<link rel="stylesheet" href="${ctx}/assets/css/gird.css">
<style>
	body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote,button {
		padding:0;
		margin:0; 
	}
	.schedule-box {
		width:1000px;
		margin:0 auto;
		position:relative;
		font-family:"微软雅黑";
	}
	.sc-t1, .sc-t2, .sc-t3, .sc-t4, .sc-t5 {
	    margin: 0 auto;
	    overflow: hidden;
	    width: 1000px;
	    height:40px;
	    margin-top: 80px;
	    background-repeat: no-repeat;
	    background-image: url(${ctx}/assets/css/images/schedule_bg.png);
	}
	.sc-t1 {
		background-position:-9px -16px;
	}
	.sc-t2 {
		background-position:-9px -64px;
	}
	.sc-t3 {
		background-position:-9px -111px;
	}
	.sc-t4 {
		background-position:-9px -158px;
	}
	.sc-t5 {
		background-position:-9px -205px;
	}
	.schedule-box ul {
		top:-50px;
		position:absolute;
	}
	.sc-text1 {
		width:86px;
		height:46px;
		background:url(${ctx}/assets/css/images/sc-text1_03.png)  no-repeat;
	}
	.schedule-box ul {
		width:106%;
	}
	.schedule-box li:nth-child(5n) {
	    margin-right:0;
	}
	.schedule-box ul li {
		float:left;
		width:156px;
		color:#fff;
		margin-left:10px;
		line-height:36px;
		margin-right:57px;
		list-style-type:none;
	}
	.schedule-box li b {
		font-size:14px;
		width:86px;
		display:block;
		text-align:center;
		font-weight:normal;
	}
	.schedule-box li.l-Blue {
		background:url(${ctx}/assets/css/images/l-Blue_bg_03.png) no-repeat;
	}
	.sc-time { 
		width:102%;
	}
	.sc-time span:nth-child(5n) {
	    margin-right:0;
	}
	.sc-time span {
		color:#0094ff;
		float:left;
		width:180px;
		margin-top:8px;
		margin-left:-20px;
		margin-right:54px;
		text-align:center;
	}
</style>
</@override>
<@override name="body">

	<div class="row" id="realMap">
	
	
		
		<div class="col-md-12">
			
		    		<div class="row">
						<div class="col-xs-10">
							<div class="panel panel-default">
					        	<div class="panel-heading">
					        		订单轨迹
					        		<input type="button" id="playcar" disabled="disabled" onclick="play()" class="button button-pill button-flat-blue button-tiny" value="开始回放" style="display:none;"/>
									<input type="button" id="resetcar" disabled="disabled" onclick="reset()" class="button button-pill button-flat button-tiny" value="重置" style="display:none;" />
									<input type="button" id="distancetool" onclick="distance()" class="button button-pill button-flat-action button-tiny" value="测距" style="display:none;" />
					        		${username?if_exists}
					        		
					        		<span id="distance_span">${distance?if_exists}公里</span>
					        		
					        	</div>
						        <#if order.status==3 || order.status==6>
						            <div id="allmap" style="z-index: 99999; height:500px;">
	        						</div>
	        					<#else>	
	        						<div class="panel-body">
						             	暂无订单轨迹
						            </div>
	    						</#if>
					        </div>
						</div>
						<div class="col-xs-2">
							<div class="panel panel-default">
					        	<div class="panel-heading">
					        		...
					        	</div>
        						<div id="points_div" style="overflow-y:auto;max-height:500px;">
					             	
					            </div>
					        </div>
						</div>
					</div>
		
		</div>


	
	</div>
	
	
	
</@override>
<@override name="footer">
	<#if order.status==3 || order.status==6>
		<script src="//api.map.baidu.com/api?v=2.0&ak=AuNk3YS21DSmHEEvIFDf9dbD" type="text/javascript"></script> 
		<script src="//api.map.baidu.com/library/DistanceTool/1.2/src/DistanceTool_min.js" type="text/javascript"></script>
		<script type="text/javascript">
			var map = null; //地图对象
			var point_marker=null;
			var points=[];
			var firstpoint=null;
			var lastpoint=null;
			var isfirst=true;
			
			var timer;     //定时器
			var index = 0; //记录播放到第几个point
			
			function initialize(){
			
				if(isfirst){
					
					$.post('${ctx}/order/pointDetails',{'id':${order.id}},function(data){
			            if(data.success){
			               if(null!=data.firstLng && null!=data.firstLat){
			               
			               		$("#distance_span").html(data.distance.toFixed(2)+"公里");
			               		
								firstpoint=new BMap.Point(data.firstLng, data.firstLat);
			               
				                map = new BMap.Map("allmap");  
								map.centerAndZoom(firstpoint, 12);
							    map.enableScrollWheelZoom();
			               		
			               		var pointmap=data.orderOrbits;
			               		
			               		var pointsDiv="";
			               		pointsDiv+="<div class='list-group'>";
			               		
			               		$(pointmap).each(function(index,element){
			               			points.push(new BMap.Point(element.lng, element.lat));
			               			pointsDiv+="<a href='JavaScript:;' class='list-group-item points_click' data-lng='"+element.lng+"' data-lat='"+element.lat+"'>"+element.lng+","+element.lat+"</a>";
			               		});
			               		
			               		pointsDiv+="</div>";
			               		
			               		$("#points_div").html(pointsDiv);
						        
						        map.addOverlay(new BMap.Polyline(points, {strokeColor: "blue", strokeWeight: 5, strokeOpacity: 1}));
						
								//显示小车子
								car = new BMap.Marker(points[0]);
								map.addOverlay(car);
								
								$("#playcar").show();
								$("#resetcar").show();
								$("#distancetool").show();
								$("#playcar").attr("disabled",false);
								$("#resetcar").attr("disabled",false);
          						
			               }
			            } else {
			                $.scojs_message(data.message, $.scojs_message.TYPE_ERROR);
			            }
				    },'json');
				    isfirst=false;
				    
				}
			    
			}
			
			function play() {
				$("#playcar").attr("disabled",true);
				$("#resetcar").attr("disabled",false);
				
				var point = points[index];
				if(index > 0) {
					map.addOverlay(new BMap.Polyline([points[index - 1], point], {strokeColor: "red", strokeWeight: 1, strokeOpacity: 1}));
				}
				car.setPosition(point);
				index++;
				
				if(index < points.length) {
					timer = window.setTimeout("play(" + index + ")", 100);
				} else {
					$("#playcar").attr("disabled",true);
					map.panTo(point);
				}
			}
			
			function reset() {
				$("#playcar").attr("disabled",false);
				
				if(timer) {
					window.clearTimeout(timer);
				}
				index = 0;
				car.setPosition(points[0]);
				map.panTo(firstpoint);
			}
			
			function distance(){
				var myDis = new BMapLib.DistanceTool(map);
				myDis.open();
			} 
			
			function modifyCashAction(){
				$.post('${ctx}/order/modifyCash',{'id':${order.id},'cash':$("#cash_input").val()},function(data){
		            if(data.success){
		                $.scojs_message('订单金额修改成功', $.scojs_message.TYPE_OK);
		                //setTimeout(function(){
			    			window.location.reload(true);
			    		//}, 1000);
		            } else {
		                $.scojs_message(data.message, $.scojs_message.TYPE_ERROR);
		            }
			    },'json');
			} 
			
			function changeCompanyMoney(){
				var driverMoney=$("#driverMoney").val();
				var wxMoney=$("#wxMoney").val();
				
				if(null!=driverMoney){
					if($("#driverPlusMinus").val()==1){
						driverMoney=Number(driverMoney)*(-1);
					}
					driverMoney=driverMoney*(-1);
				}
				
				var companyMoney=driverMoney;
				
				if(null!=wxMoney){
					if($("#wxPlusMinus").val()==1){
						wxMoney=Number(wxMoney)*(-1);
					}
					wxMoney=wxMoney*(-1);
					companyMoney+=wxMoney;
				}
				
				if(companyMoney>0){
					$("#companyMoney").html("+"+companyMoney);
				}
				else{
					$("#companyMoney").html("<font color='red'>"+companyMoney+"</font>");
				}
			}
			
			$(document).ready(function(){
			
				initialize();
			
				$(document).on("click",".points_click",function(){
					
					if(null!=point_marker){
						point_marker.remove();
					}
		
					point_marker = new BMap.Marker(new BMap.Point($(this).attr("data-lng"), $(this).attr("data-lat")));
					map.addOverlay(point_marker);
					var label = new BMap.Label("当前位置",{offset:new BMap.Size(20,-10)});
					point_marker.setLabel(label);
					
					$("#points_div a").removeClass("active");
					$(this).addClass("active");
				});
			    
			    $("#modifyCash").click(function(){
			    	//$("#modifyCash").hide();
			    	//$("#cash_span").hide();
			    	//$("#cash_input").show().focus();
			    	//$("#modifyCash_ok").show();
			    	$('#dialog_modifyCash').modal();
			    });
			    
			    $("#modifyCash_ok").click(function(){
				    //var reg=/^\+?[0-9][0-9]*$/
					//if(!reg.test($("#cash_input").val())){
				    //   $.scojs_message('无效的金额，金额必须为零或正整数', $.scojs_message.TYPE_ERROR);
				    //   return;
				    //}
				    //var confirm = $.scojs_confirm({
			        	//content: "确认要将订单金额修改为"+$("#cash_input").val()+"元吗？",
				    	//action:modifyCashAction
				    //});
				    //confirm.show();
				   // $('#dialog_modifyCash').modal();
			    });
			    
			    //余额  增加/减少
			    $("#driver_virtual_plusminus").click(function(){
			    	if($(this).find("span").hasClass("glyphicon-plus")){
			    		$(this).find("span").removeClass("glyphicon-plus").addClass("glyphicon-minus");
			    		$("#driverPlusMinus").val(1);
			    	}
			    	else{
			    		$(this).find("span").removeClass("glyphicon-minus").addClass("glyphicon-plus");
			    		$("#driverPlusMinus").val(0);
			    	}
			    	changeCompanyMoney();
			    });
			    $("#member_virtual_plusminus").click(function(){
			    	if($(this).find("span").hasClass("glyphicon-plus")){
			    		$(this).find("span").removeClass("glyphicon-plus").addClass("glyphicon-minus");
			    		$("#memberPlusMinus").val(1);
			    	}
			    	else{
			    		$(this).find("span").removeClass("glyphicon-minus").addClass("glyphicon-plus");
			    		$("#memberPlusMinus").val(0);
			    	}
			    });
			    $("#wx_virtual_plusminus").click(function(){
			    	if($(this).find("span").hasClass("glyphicon-plus")){
			    		$(this).find("span").removeClass("glyphicon-plus").addClass("glyphicon-minus");
			    		$("#wxPlusMinus").val(1);
			    	}
			    	else{
			    		$(this).find("span").removeClass("glyphicon-minus").addClass("glyphicon-plus");
			    		$("#wxPlusMinus").val(0);
			    	}
			    	changeCompanyMoney();
			    });
			    
			    //推荐金额
			    $("#newCash").change(function(){
			    	var reg=/^\+?[0-9][0-9]*$/
					if(!reg.test($("#newCash").val())){
				       $.scojs_message('无效的金额，修改后金额必须为整数', $.scojs_message.TYPE_ERROR);
				       return;
				    }
			    	$.get('${ctx}/order/getTuijianMoney',{'id':${order.id},'cash':$("#newCash").val()},function(data){
	    				
	    				if(data.success){
	    					if(data.map){
	    						var driverMoney=data.map.driverMoney;
		    					var memberMoney=data.map.memberMoney;
		    					var wxMoney=data.map.wxMoney;
		    					var companyMoney=data.map.driverMoney;
		    					
		    					if(driverMoney>=0){
		    						$("#driverMoney").val(driverMoney);
		    						$("#driver_virtual_plusminus").find("span").removeClass("glyphicon-minus").addClass("glyphicon-plus");
				    				$("#driverPlusMinus").val(0);
		    					}
		    					else{
		    						$("#driverMoney").val(-driverMoney);
		    						$("#driver_virtual_plusminus").find("span").removeClass("glyphicon-plus").addClass("glyphicon-minus");
				    				$("#driverPlusMinus").val(1);
		    					}
		    					
		    					if(memberMoney>=0){
		    						$("#memberMoney").val(memberMoney);
		    						$("#member_virtual_plusminus").find("span").removeClass("glyphicon-minus").addClass("glyphicon-plus");
				    				$("#memberPlusMinus").val(0);
		    					}
		    					else{
		    						$("#memberMoney").val(-memberMoney);
		    						$("#member_virtual_plusminus").find("span").removeClass("glyphicon-plus").addClass("glyphicon-minus");
				    				$("#memberPlusMinus").val(1);
		    					}
		    					
		    					if(null!=wxMoney){
			    					if(wxMoney>=0){
			    						$("#wxMoney").val(wxMoney);
			    						$("#wx_virtual_plusminus").find("span").removeClass("glyphicon-minus").addClass("glyphicon-plus");
					    				$("#wxPlusMinus").val(0);
			    					}
			    					else{
			    						$("#wxMoney").val(-wxMoney);
			    						$("#wx_virtual_plusminus").find("span").removeClass("glyphicon-plus").addClass("glyphicon-minus");
					    				$("#wxPlusMinus").val(1);
			    					}
			    					companyMoney+=wxMoney;
		    					}
		    					
		    					if(companyMoney>0){
		    						$("#companyMoney").html("<font color='red'>"+(-1*companyMoney)+"</font>");
		    					}
		    					else{
		    						$("#companyMoney").html("+"+(-1*companyMoney));
		    					}
	    					}
	    					else{
	    						//混合支付
	    						
	    					}
	    					
	    				}
	    				else{
	    					$.scojs_message(data.message, $.scojs_message.TYPE_ERROR);
	    				}
    				});
			    });
			    
			    //金额改变
			    $("#driverMoney").change(function(){
			    	changeCompanyMoney();
			    });
			    $("#wxMoney").change(function(){
			    	changeCompanyMoney();
			    });
			    
			    $("#close_modal_modifyCash").click(function(){
					$('#dialog_modifyCash').modal("hide");
				});
				
				$("#ok_modal_modifyCash").click(function(){
					var reg=/^\+?[0-9][0-9]*(\.\d{1,2})?$/
					if(!reg.test($("#newCash").val()) || !reg.test($("#driverMoney").val()) || !reg.test($("#memberMoney").val())){
				       $.scojs_message('无效的金额，余额变动金额最多保留2位小数', $.scojs_message.TYPE_ERROR);
				       return;
				    }
				    
				    <#if weixinManager>
				    	if(!reg.test($("#wxMoney").val())){
					       $.scojs_message('无效的金额，余额变动金额最多保留2位小数', $.scojs_message.TYPE_ERROR);
					       return;
					    }
				    </#if>
				    
					if($("#dialog_modifyCash_content").val()==""){
						$.scojs_message('请填写修改原因', $.scojs_message.TYPE_ERROR);
						return false;
					}
					
					var message="";
					if($("#driverPlusMinus").val()==0){
						message+="服务人员余额将增加"+$("#driverMoney").val()+"元，";
					}
					else{
						message+="服务人员余额将减少"+$("#driverMoney").val()+"元，";
					}
					if($("#memberPlusMinus").val()==0){
						message+="客户余额将增加"+$("#memberMoney").val()+"元。";
					}
					else{
						message+="客户余额将减少"+$("#memberMoney").val()+"元。";
					}
					
					<#if weixinManager>
						if($("#wxPlusMinus").val()==0){
							message+="客户经理余额将增加"+$("#wxMoney").val()+"元。";
						}
						else{
							message+="客户经理余额将减少"+$("#wxMoney").val()+"元。";
						}
					</#if>
					
					var confirm = $.scojs_confirm({
				        content: "确认要将订单金额从${order.realCash?if_exists}元修改为"+$("#newCash").val()+"元吗？"+message,
				        action:function(){
				        	$("#ok_modal_modifyCash").attr("disabled",true);
				        	$.post('${ctx}/order/modifyCash',$("#modify_form").serialize(),function(data){
					            if(data.success){
					                $.scojs_message('订单金额修改成功', $.scojs_message.TYPE_OK);
					                //setTimeout(function(){
						    			window.location.reload(true);
						    		//}, 1000);
					            } else {
					            	$("#ok_modal_modifyCash").attr("disabled",false);
					                $.scojs_message(data.message, $.scojs_message.TYPE_ERROR);
					            }
						    },'json');
				        }
			        });
			        confirm.show();
					
				});
	
			});
			
		    
		</script>
	</#if>
</@override>
<@extends name="../layout.ftl"/>